//Flag between pool and question
var flag = true;

/**
 * 
 * Pool
 */
// backup pool
var backupPool;
var txtPoolName = "<input type=\"text\" id=\"txtPool\" class=\"poolName form-control txtPoolName\">";
var btnControl = "<a href=\"\" class=\"poolUpdate\"> <i"
		+ " class=\"fa fa-check fa-2x\"></i><span class=\"nav-text\">Update</span></a><a "
		+ "href=\"#\" class=\"poolCancel\"><i class=\"fa fa-undo fa-2x\"></i><span"
		+ " class=\"nav-text\">Cancel</span></a>";
var flagEditPool = true;
var flagAddPool = true;
// Edit pool
$(document).on(
		"click",
		".poolEdit",
		function() {
			if (flag == false) {
				alert("Action not allow");
				return false;
			}
			if (flagEditPool == false || flagAddPool == false) {
				alert("Action not allow");
				return false;
			}
			flag = false;
			flagEditPool = false;
			var control = $(this).parent();
			var poolId = $(this).parent().siblings().children(".poolId");
			var poolNum = $(this).parent().siblings().children(".poolNum");
			var poolName = $(this).parent().siblings().children(".poolName");
			backupPool = $(this).parent().parent().html();
			$.ajax({
				url : '/UTEHOME/portal/lecturer/subject/pool/' + poolId.text()
						+ '/edit',
				type : 'GET',
				dataType : 'json',
				contentType : 'application/json; charset=utf-8',
				error : function(xhr) {
					alert("Error");
					alert('Error: ' + xhr.statusText);
				},
				success : function(data) {
					poolId.text(data.questionPoolId);
					poolName.replaceWith(txtPoolName);
					poolName = $("#txtPool");
					poolName.val(data.questionPoolName);
				},
				async : true,
				processData : false
			});

			control.html(btnControl);
			return false;
		});

// Update pool
$(document).on("click", ".poolUpdate", function() {
	var control = $(this).parent();
	var poolId = $(this).parent().siblings().children(".poolId");
	var poolNum = $(this).parent().siblings().children(".poolNum");
	var poolName = $(this).parent().siblings().children(".poolName");
	var poolUl = $(this).parent().parent();
	var requestData = {
		questionPoolId : poolId.text(),
		questionPoolName : poolName.val()
	};

	$.ajax({
		url : '/UTEHOME/portal/lecturer/subject/pool/update',
		type : 'POST',
		data : JSON.stringify(requestData),
		dataType : 'json',
		contentType : 'application/json; charset=utf-8',
		error : function(xhr) {
			alert('Error: ' + xhr.statusText);
			poolUl.html(backupPool);
		},
		success : function(data) {
			poolUl.html(backupPool);
			poolUl.find(".poolName").text(data.questionPoolName);
			poolUl.find(".poolId").text(data.questionPoolId);
		},
		async : true,
		processData : false
	});
	flagEditPool = true;
	flagAddPool = true;
	flag = true;
	return false;
});

var addPoolLine = "<div><a class=\"addNewPool\" href=\"\">Add New Pool</a></div>";
var newPool = "<div class=\"question_pool\"><div class=\"pool_name\"><ul><li><h6 class=\"poolId hidden\"></h6><h3 class=\"poolNum\">Pool Name:</h3>"
		+ "<input type=\"text\" class=\"poolName form-control txtPoolName\" id=\"txtPool\"></li><li class=\"pull-right\">"
		+ "<a class=\"poolSave\" href=\"\"> <i class=\"fa fa-check fa-2x\"></i><span class=\"nav-text\">Save</span></a>"
		+ "<a class=\"poolCancel\" href=\"#\"><i class=\"fa fa-undo fa-2x\"></i><span class=\"nav-text\">Cancel</span>"
		+ "</a></li></ul></div><div class=\"pool_content\">"
		+ "<div class=\"choose_pool\"><a class=\"choosePool\" href=\"#\">Choose From Pool</a>"
		+ "<div id=\"pool\" ></div></div>"
		+ "<div class=\"add_question\"><a class=\"addQuestion\" href=\"#\">Add Question</a></div></div></div>";
var choosePoolLine = "<div class=\"add_question\"><a class=\"choosePool\" href=\"#\">Choose From Pool</a></div>";
var btnEditRemove = "<a href=\"\" class=\"poolEdit\"> <i"
		+ " class=\"fa fa-wrench fa-2x\"></i><span class=\"nav-text\">Edit</span></a><a "
		+ "href=\"#\" class=\"poolRemove\"><i class=\"fa fa-trash fa-2x\"></i><span"
		+ " class=\"nav-text\">Remove</span></a>";
var backupAdd;
// Add new pool
$(document).on("click", ".addNewPool", function() {
	if (flag == false) {
		alert("Action not allow");
		return false;
	}
	if (flagEditPool == false || flagAddPool == false) {
		alert("Action not allow");
		return false;
	}
	flag = false;
	flagAddPool = false;
	// Ajax load pool
	$(addPoolLine).insertAfter($(this).parent());
	$(newPool).insertAfter($(this).parent());
	return false;
});

$(document).on(
		"click",
		".poolSave",
		function() {
			// Ajax load pool
			var poolName = $(this).parent().siblings().children(".poolName");
			var requestData = {
				testPoolId : null,
				testPoolName : poolName.val()
			};
			// Ajax load pool
			$.ajax({
				url : '/UTEHOME/portal/lecturer/subject/pool/add',
				type : 'POST',
				data : JSON.stringify(requestData),
				dataType : 'json',
				contentType : 'application/json; charset=utf-8',
				error : function(xhr) {
					alert('Error: ' + xhr.statusText);
					// Return previous state
				},
				success : function(data) {
					// Show data
					$("#txtPool").siblings(".poolId").text(data.testPoolId);
					$("#txtPool").parent().siblings().html(btnEditRemove);
					$("#txtPool").replaceWith(
							"<h3 class=\"poolName\">" + data.testPoolName
									+ "</h3>");
				},
				async : true,
				processData : false
			});
			flagEditPool = true;
			flagAddPool = true;
			flag = true;
			return false;
		});

// Cancel in pool name
$(document).on("click", ".poolCancel", function() {
	var poolUl = $(this).parent().parent();
	if (flagEditPool == false) {// Editing
		poolUl.html(backupPool);
	}
	if (flagAddPool == false) {// Adding
		var pool = $(this).parent().parent().parent().parent();
		pool.next().remove();
		pool.remove();
	}
	flagEditPool = true;
	flagAddPool = true;
	flag = true;
	return false;
});

// Remove in pool name
$(document).on(
		"click",
		".poolRemove",
		function() {
			var poolId = $(this).parent().siblings().children(".poolId");
			var pool = $(this).parent().parent().parent().parent();
			$.ajax({
				url : '/UTEHOME/portal/lecturer/subject/pool/' + poolId.text()
						+ '/delete',
				type : 'GET',
				error : function(xhr) {
					alert('Error: ' + xhr.statusText);
				},
				success : function(data) {
					alert(data);
					pool.next().remove();
					pool.remove();
					// Load list pool???
				},
				async : true,
				processData : false
			});
			return false;
		});

/**
 * Question
 * 
 * @param i
 */

// True/False Template
var truefalse = "<div class=\"question\" id=\"edit\">"
		+ "<div class=\"question_type\">"
		+ "<select id=\"qType\" class=\"form-control\" style=\"width: 150px;\""
		+ "onchange=\"changeType()\">"
		+ "<option value=\"1\">True/False</option>"
		+ "<option value=\"2\">Single Choice</option>"
		+ "<option value=\"3\">Multiple Choice</option>"
		+ "</select>"
		+ "</div>"
		+ "<div class=\"question_number\">"
		+ "<ul>"
		+ "<li><h6 class=\"questionId hidden\">JAVA_OOP_002</h6>"
		+ "<h5 class=\"questionNum\">Question 2:</h5></li>"
		+ "<li class=\"pull-right\"><a href=\"#\" class=\"removeQuestion\">Remove</a>"
		+ "</ul>"
		+ "</div>"
		+ "<div class=\"question_name\">"
		+ "<textarea id=\"q_name\" rows=\"5\" cols=\"75\"></textarea>"
		+ "</div>"
		+ "<table class=\"question_answer\">"
		+ "<tr class=\"answer\">"
		+ "<td><label><input type=\"radio\" name=\"q\" value=\"A\" />A. True</label></td>"
		+ "<td></td>"
		+ "</tr>"
		+ "<tr class=\"answer\">"
		+ "<td><label><input type=\"radio\" name=\"q\" value=\"B\" />B. False</label></td>"
		+ "<td></td>"
		+ "				</tr>"
		+ "			</table>"
		+ "<table class=\"question_answer\">"
		+ "				<tr>"
		+ "<td></td>"
		+ "<td><a href=\"#\" id=\"updateQuestion\" class=\"btn btn-primary btn-sm\""
		+ ">Update</a><a href=\"\" class=\"btn btn-primary btn-sm\""
		+ " id=\"cancelQuestion\">Cancel</a></td>" + "</tr>" + "			</table>"
		+ "		</div>"

// Multiple choice Templete
var multiChoice = "<div class=\"question\" id=\"edit\">"
		+ "<div class=\"question_type\">"
		+ "<select id=\"qType\" class=\"form-control\" style=\"width: 150px;\""
		+ "onchange=\"changeType()\">"
		+ "<option value=\"1\">True/False</option>"
		+ "<option value=\"2\">Single Choice</option>"
		+ "<option value=\"3\">Multiple Choice</option>"
		+ "</select>"
		+ "</div>"
		+ "<div class=\"question_number\">"
		+ "<ul>"
		+ "<li><h6 class=\"questionId hidden\">JAVA_OOP_002</h6>"
		+ "<h5 class=\"questionNum\">Question 2:</h5></li>"
		+ "<li class=\"pull-right\"><a href=\"#\" class=\"removeQuestion\">Remove</a>"
		+ "</ul>"
		+ "</div>"
		+ "<div class=\"question_name\">"
		+ "<textarea id=\"q_name\" rows=\"5\" cols=\"75\"></textarea>"
		+ "</div>"
		+ "<table class=\"question_answer\">"
		+ "<tr class=\"answer\">"
		+ "<td><label><input type=\"checkbox\" name=\"q\" value=\"A\" />A.</label></td>"
		+ "<td><textarea id=\"A\" rows=\"3\" cols=\"75\"></textarea></td>"
		+ "</tr>"
		+ "<tr class=\"answer\">"
		+ "<td><label><input type=\"checkbox\" name=\"q\" value=\"B\" />B.</label></td>"
		+ "<td><textarea id=\"B\" rows=\"3\" cols=\"75\"></textarea></td>"
		+ "</tr>"
		+ "<tr class=\"answer\">"
		+ "<td><label><input type=\"checkbox\" name=\"q\" value=\"C\" />C.</label></td>"
		+ "<td><textarea id=\"C\" rows=\"3\" cols=\"75\"></textarea></td>"
		+ "</tr>"
		+ "<tr class=\"answer\">"
		+ "<td><label><input type=\"checkbox\" name=\"q\" value=\"D\" />D.</label></td>"
		+ "<td><textarea id=\"D\" rows=\"3\" cols=\"75\"></textarea></td>"
		+ "</tr>"
		+ "</table>"
		+ "<table class=\"question_answer\">"
		+ "<tr>"
		+ "<td></td>"
		+ "<td><a href=\"#\""
		+ "onclick=\"javascript:addAnswer(0); return false;\">Add Answer</a></td>"
		+ "</tr>"
		+ "<tr>"
		+ "<td></td>"
		+ "<td><a href=\"#\" id=\"updateQuestion\" class=\"btn btn-primary btn-sm\""
		+ ">Update</a><a href=\"\" class=\"btn btn-primary btn-sm\""
		+ " id=\"cancelQuestion\">Cancel</a></td>" + "</tr>" + "</table>"
		+ "</div>";

// Single choice Template
var singleChoice = "<div class=\"question\" id=\"edit\">"
		+ "<div class=\"question_type\">"
		+ "<select id=\"qType\" class=\"form-control\" style=\"width: 150px;\""
		+ "onchange=\"changeType()\">"
		+ "<option value=\"1\">True/False</option>"
		+ "<option value=\"2\">Single Choice</option>"
		+ "<option value=\"3\">Multiple Choice</option>"
		+ "</select>"
		+ "</div>"
		+ "<div class=\"question_number\">"
		+ "<ul>"
		+ "<li><h6 class=\"questionId hidden\">JAVA_OOP_002</h6>"
		+ "<h5 class=\"questionNum\">Question 2:</h5></li>"
		+ "<li class=\"pull-right\"><a href=\"#\" class=\"removeQuestion\">Remove</a>"
		+ "</ul>"
		+ "</div>"
		+ "<div class=\"question_name\">"
		+ "<textarea id=\"q_name\" rows=\"5\" cols=\"75\"></textarea>"
		+ "</div>"
		+ "<table class=\"question_answer\">"
		+ "<tr class=\"answer\">"
		+ "<td><label><input type=\"radio\" name=\"q\" value=\"A\" />A.</label></td>"
		+ "<td><textarea id=\"A\" rows=\"3\" cols=\"75\"></textarea></td>"
		+ "</tr>"
		+ "<tr class=\"answer\">"
		+ "<td><label><input type=\"radio\" name=\"q\" value=\"B\" />B.</label></td>"
		+ "<td><textarea id=\"B\" rows=\"3\" cols=\"75\"></textarea></td>"
		+ "</tr>"
		+ "<tr class=\"answer\">"
		+ "<td><label><input type=\"radio\" name=\"q\" value=\"C\" />C.</label></td>"
		+ "<td><textarea id=\"C\" rows=\"3\" cols=\"75\"></textarea></td>"
		+ "</tr>"
		+ "<tr class=\"answer\">"
		+ "<td><label><input type=\"radio\" name=\"q\" value=\"D\" />D.</label></td>"
		+ "<td><textarea id=\"D\" rows=\"3\" cols=\"75\"></textarea></td>"
		+ "</tr>"
		+ "</table>"
		+ "<table class=\"question_answer\">"
		+ "<tr>"
		+ "<td></td>"
		+ "<td><a href=\"#\""
		+ "onclick=\"javascript:addAnswer(0); return false;\">Add Answer</a></td>"
		+ "</tr>"
		+ "<tr>"
		+ "<td></td>"
		+ "<td><a href=\"#\" id=\"updateQuestion\" class=\"btn btn-primary btn-sm\""
		+ ">Update</a><a href=\"\" class=\"btn btn-primary btn-sm\""
		+ " id=\"cancelQuestion\">Cancel</a></td>" + "</tr>" + "</table>"
		+ "</div>";

var btnAddQuestion = "<a href=\"\" id=\"addQuestion\" class=\"btn btn-primary btn-sm\">Add</a>";
var lineAddQuestion = "<div class=\"add_question\"><a class=\"addQuestion\" href=\"#\">Add Question</a></div>";

// Backup
var backupEditQuestion;

// Flag add question
var flagEditQuestion = true;
var flagAddQuestion = true;
// Show template for add question when click add question line
$(document).on("click", ".addQuestion", function() {
	if (flagAddQuestion == false || flagEditQuestion == false) {
		alert("Action not allow");
		return false;
	}
	flagAddQuestion = false;
	var question = $(this).parent();
	$(truefalse + lineAddQuestion).insertAfter(question);
	$("#updateQuestion").replaceWith(btnAddQuestion);
	autoArrange();
	return false;
});

// True false question
var truefalseQuestion = "<div class=\"question\"><div class=\"question_number\"><ul><li><h6 class=\"questionId hidden\">"
		+ "</h6><h5 class=\"questionNum\">Question 2:</h5></li><li class=\"pull-right\"><a class=\"editQuestion\" href=\"\">Edit</a>"
		+ "<a class=\"removeQuestion\" href=\"\">Remove</a></li></ul></div><div class=\"question_name\"></div><div class=\"question_answer\">"
		+ "<div><input type=\"radio\" value=\"A\"disabled>A. True</div><div><input type=\"radio\" value=\"B\" disabled>B. False</div></div></div>";
// Mutil Choice
var multiChoiceQuestion = "<div class=\"question\"><div class=\"question_number\"><ul><li><h6 class=\"questionId hidden\"></h6>"
		+ "<h5 class=\"questionNum\">Question 1:</h5></li><li class=\"pull-right\"><a class=\"editQuestion\" href=\"\">Edit</a>"
		+ "<a class=\"removeQuestion\" href=\"\">Remove</a></li></ul></div><div class=\"question_name\"></div><div class=\"question_answer\">"
		+ "<div><input type=\"checkbox\" value=\"A\" disabled></div><div><input type=\"checkbox\" value=\"B\" disabled></div><div>"
		+ "<input type=\"checkbox\" value=\"C\" disabled></div><div><input type=\"checkbox\" value=\"D\" disabled></div></div></div>";

var singleChoiceQuestion = "<div class=\"question\"><div class=\"question_number\"><ul><li><h6 class=\"questionId hidden\"></h6>"
		+ "<h5 class=\"questionNum\">Question 1:</h5></li><li class=\"pull-right\"><a class=\"editQuestion\" href=\"\">Edit</a>"
		+ "<a class=\"removeQuestion\" href=\"\">Remove</a></li></ul></div><div class=\"question_name\"></div><div class=\"question_answer\">"
		+ "<div><input type=\"radio\" value=\"A\" disabled></div><div><input type=\"radio\" value=\"B\" disabled></div><div>"
		+ "<input type=\"radio\" value=\"C\" disabled></div><div><input type=\"radio\" value=\"D\" disabled></div></div></div>";

// Save when click add new question button
$(document).on("click", "#addQuestion", function() {
	var question = "";
	var answer = "";
	var rightAnswer = "";
	var point;

	question = $("#q_name").val()
	var type = $("#qType").val();
	// Right Answer
	if (type == 3) {// Checkbox
		var rightAnswers = $("#edit .question_answer input[name=q]:checked");
		rightAnswers.each(function() {
			rightAnswer += $(this).val();
		});
	} else {// Radio
		rightAnswer = $("#edit .question_answer input[name=q]:checked").val();
	}

	// Answer
	if (type != 1) {
		answer += ("A_" + $("#A").val());
		answer += (";B_" + $("#B").val());
		answer += (";C_" + $("#C").val());
		answer += (";D_" + $("#D").val());
	}
	// Get point??
	var requestData = {
		questionId : null,
		question : question,
		answer : answer,
		point : 1,
		rightAnswer : rightAnswer,
		type : type
	};
	// Get pool of this question
	var questionPool;
	questionPool = $(this).parents(".question_pool");
	// Get poolId of this question
	var poolId;
	poolId = questionPool.find(".poolId").text();

	$.ajax({
		url : "../"+poolId+"/question/addToPool",
		data : JSON.stringify(requestData),
		dataType : 'json',
		contentType : 'application/json; charset=utf-8',
		type : "POST",
		error : function(error) {
			alert(error);
		},
		success : function(data) {
			// Process after add?
			showQuestion(type, data);
			autoArrange();
		},
		async : true,
		processData : false
	});
	flagAddQuestion = true;
	flagEditQuestion = true;
	autoArrange();
	return false;
});

// Show data after add
function showQuestion(type, data) {
	var question = $("#edit");
	var answer = data.answer.split(";");
	var rightAnswer = data.rightAnswer;

	if (type == 1) {
		// True/False
		question = $(truefalseQuestion).replaceAll("#edit");
		question.find(".questionId").text(data.questionId);
		question.find(".question_name").text(data.question);
		// Show check
		question.find("input[value=" + rightAnswer + "]").prop("checked", true);
		return false;
	} else if (type == 2) {
		// Single Choice
		question = $(singleChoiceQuestion).replaceAll("#edit");
		question.find("input[value=A]").parent().html(
				"<input type=\"radio\" value=\"A\" disabled>"
						+ answer[0].substring(2, answer[0].length));
		question.find("input[value=B]").parent().html(
				"<input type=\"radio\" value=\"B\" disabled>"
						+ answer[1].substring(2, answer[1].length));
		question.find("input[value=C]").parent().html(
				"<input type=\"radio\" value=\"C\" disabled>"
						+ answer[2].substring(2, answer[2].length));
		question.find("input[value=D]").parent().html(
				"<input type=\"radio\" value=\"D\" disabled>"
						+ answer[3].substring(2, answer[3].length));
	} else {
		// Multi Choice
		question = $(multiChoiceQuestion).replaceAll("#edit");
		question.find("input[value=A]").parent().html(
				"<input type=\"checkbox\" value=\"A\" disabled>"
						+ answer[0].substring(2, answer[0].length));
		question.find("input[value=B]").parent().html(
				"<input type=\"checkbox\" value=\"B\" disabled>"
						+ answer[1].substring(2, answer[1].length));
		question.find("input[value=C]").parent().html(
				"<input type=\"checkbox\" value=\"C\" disabled>"
						+ answer[2].substring(2, answer[2].length));
		question.find("input[value=D]").parent().html(
				"<input type=\"checkbox\" value=\"D\" disabled>"
						+ answer[3].substring(2, answer[3].length));
	}
	question.find(".questionId").text(data.questionId);
	question.find(".question_name").text(data.question);
	// Selected
	for (var i = 0; i < rightAnswer.length; i++) {
		question.find("input[value=" + rightAnswer[i] + "]").prop("checked",
				true);
	}
	return false;
}

// Edit when click edit question
$(document).on("click", ".editQuestion", function() {
	// Get question id;
	if (flagAddQuestion == false || flagEditQuestion == false) {
		alert("Action not allow");
		return false;
	}
	flagEditQuestion = false;
	var question = $(this).parents(".question");
	var questionId = question.find(".questionId").text();
	// Using ajax get Server question
	$.ajax({
		url : "../noPoolId/question/" + questionId,
		type : "GET",
		dataType : "json",
		contentType : "application/json; charset=utf-8",
		error : function(error) {
			alert(error + "Error No Processing");
		},
		success : function(data) {
			backupEditQuestion = question.clone();
			var answer = data.answer.split(";");
			if (data.type == 1) {
				question.replaceWith(truefalse);
			} else if (data.type == 2) {
				question.replaceWith(singleChoice);
			} else {
				question.replaceWith(multiChoice);
			}

			$("#qType").val(data.type);
			$("#qType").prop("disabled", true);
			$("#q_name").val(data.question);
			$("#edit").find(".questionId").text(questionId);

			// Show database
			if (data.type == 1) {
				// set true or false
			} else {
				$("#A").val(answer[0].substring(2, answer[0].length));
				$("#B").val(answer[1].substring(2, answer[1].length));
				$("#C").val(answer[2].substring(2, answer[2].length));
				$("#D").val(answer[3].substring(2, answer[3].length));
			}
			// Set old right Answer
			if (data.type != 1) {
				for(var i = 0; i < data.rightAnswer.length; i++){
					$("#"+data.rightAnswer[i]).parent().siblings().find("input").prop("checked", true);
				}
			} else {// True false
				$("#edit").find("input[value="+data.rightAnswer+"]").prop("checked", true);
			}
			autoArrange();
		}
	});
	return false;
});

// Update when click update in edit action
$(document).on("click", "#updateQuestion", function() {
	var question = "";
	var answer = "";
	var rightAnswer = "";
	var point;

	question = $("#q_name").val()
	var type = $("#qType").val();
	// Right Answer
	if (type == 3) {// Checkbox
		var rightAnswers = $("#edit .question_answer input[name=q]:checked");
		rightAnswers.each(function() {
			rightAnswer += $(this).val();
		});
	} else {// Radio
		rightAnswer = $("#edit .question_answer input[name=q]:checked").val();
	}

	// Answer
	if (type != 1) {
		answer += ("A_" + $("#A").val());
		answer += (";B_" + $("#B").val());
		answer += (";C_" + $("#C").val());
		answer += (";D_" + $("#D").val());
	}
	// Get question id
	var questionId = $("#edit").find(".questionId").text();
	// Get point??
	var requestData = {
		questionId : questionId,
		question : question,
		answer : answer,
		point : 1,
		rightAnswer : rightAnswer,
		type : type
	};

	$.ajax({
		url : "../noPoolId/question/edit/" + questionId,
		data : JSON.stringify(requestData),
		dataType : 'json',
		contentType : 'application/json; charset=utf-8',
		type : "POST",
		error : function(error) {
			alert(error);
		},
		success : function(data) {
			showQuestion(type, data);
		},
		async : true,
		processData : false
	});
	// Process after update?
	flagAddQuestion = true;
	flagEditQuestion = true;
	return false;
});

// Remove question
$(document).on(
		"click",
		".removeQuestion",
		function() {
			var question = $(this).parents(".question");
			var questionId = question.find(".questionId").text();
			var lineAddQuestion;
			// just remove html when add new question
			if (flagAddQuestion == false) {
				// Remove html but not call controller
				lineAddQuestion = question.next();
				question.remove();
				lineAddQuestion.remove();
				flagAddQuestion = true;
				flagEditQuestion = true;
				flag = true;
				return false;
			} else {
				$.ajax({
					url : "../noPoolId/question/delete/" + questionId,
					type : "GET",
					error : function(jqXHR, textStatus, errorThrown) {
						alert(errorThrown);
					},
					success : function(data) {
						if (data == "OK") {
							// Remove when #edit is avaiable
							if (flagEditQuestion == false) {
								lineAddQuestion = question.next();
								lineAddQuestion.remove();
								question.remove();
							} else {
								question.next().remove(); // Remove line add
								// question after
								// question
								question.remove();// remove question
							}
							flagAddQuestion = true;
							flagEditQuestion = true;
							flag = true;
							autoArrange();
							alert("Delete " + data);
						} else
							alert("Error");
					},
				});
			}
			return false;
		});

// Cancel
$(document).on("click", "#cancelQuestion", function() {
	var question = $("#edit");
	var lineAddQuestion = question.next();
	if (flagAddQuestion == false) {
		// just remove new question
		question.remove();
		lineAddQuestion.remove();
	} else {
		// backup to previous state
		question.replaceWith(backupEditQuestion);
		// lineAddQuestion.remove();
	}
	flagAddQuestion = true;
	flagEditQuestion = true;
	autoArrange();
	return false;
});

$(document).on("change", "#qType", function() {
	var question = $("#edit");
	var type = $("#qType").val();
	if (type == 1) {
		question.replaceWith(truefalse);
	} else if (type == 2) {
		question.replaceWith(singleChoice);
	} else {
		question.replaceWith(multiChoice);
	}
	try {
		$("#updateQuestion").replaceWith(btnAddQuestion);
	} catch (e) {

	}
	$("#qType").val(type);
	autoArrange();
	return false;
});

$(document).ready(function(){
	autoArrange();
});

function autoArrange(){
	var questions = $("#main_content").find(".question");
	for(var i = 0; i < questions.length; i++){
		var question = $(".question:eq("+i+")");
		var questionNum = question.find(".questionNum");
		questionNum.text("Question " + (i+1));
	}
};